/**
 * 侧边栏文件夹
 */
#sidebar-folder {
  .folder {
    height: calc(~'100vh - 48px');
    overflow: auto;

    .folder-open,
    .folder-close,
    .folder-file {
      font-size: 20px;
      margin-left: -8px;
    }

    .folder-open {
      display: none;
    }

    .mdui-collapse-item-header,
    .file {
      height: 32px;
      line-height: 32px;
      cursor: pointer;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;

      &:hover,
      &.active {
        background-color: rgba(255,255,255,.08);
      }
    }

    .mdui-collapse-item-arrow {
      transform: rotate(90deg);
    }

    .mdui-collapse-item-open {
      & > .mdui-collapse-item-header {
        & > .mdui-collapse-item-arrow {
          transform: rotate(180deg);
        }

        & > .folder-open {
          display: inline;
        }

        & > .folder-close {
          display: none;
        }
      }
    }

    .mdui-collapse-item-header {
      padding: 0 16px 0 10px;
    }

    .file {
      margin: 0;
    }

    .mdui-collapse-item-body {
      .file {
        padding-left: 58px;
      }
    }
  }

  .mdui-theme-layout-light & {
    .folder {
      .mdui-collapse-item-header,
      .file {
        &:hover,
        &.active {
          background-color: rgba(0,0,0,.08);
        }
      }
    }
  }
}

#sidebar-folder {
  .folder {
    & > .mdui-collapse > .mdui-collapse-item {
      .loop(@counter) when (@counter < 100) {
        & > .mdui-collapse-item-body > .mdui-collapse > .mdui-collapse-item {
          .loop(@counter + 1);

          & > .mdui-collapse-item-header {
            padding-left: (16px * @counter + 10px) !important;
          }
          & > .mdui-collapse-item-body > .file {
            padding-left: (48px + 10px + 16px * @counter) !important;
          }
        }
      }
      .loop(1);
    }
  }
}
